<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>腾讯首页</title>
	<style type="text/css">
 .body{width: 1000px;background: #FFFFFF;margin:0 auto;}
 /*{设置主体尺寸并居中}*/
 .header{width: 1000px;height: 90px;background: #FFFFFF;}
 .logo{width: 280px;height: 70px;background: #A349A4;
 	margin:10px 10px; float: left;}

.search{width: 380px;height: 70px;background:#ED1C24 ;
 	margin:10px 10px; float: left;}

.link{width: 280px;height: 70px;background:#7092BE ;
 	margin:10px 10px;float: left;} 	
.baike{width: 980px;height: 60px;background:#FFFFFF;margin: 10px; }
.li{width: 150px;height:50px;background: #22B14C;
 	margin:5px 5px; float: left;}
 .top3{width: 980px;height: 70px;background: #FFFFFF;
 	margin-top: 10px;}
 .top4{width: 1000px;height: 70px;background:#99D9EA;}
 .QRcode{width: 700px;height: 60px;background:#99D9EA;margin: 5px 10px;float: left; }

.hotpiont{width: 240px;height: 60px;background:#99D9EA;
	margin: 5px 10px;float: right;}
.news{width: 1000px;height:300px;background:#FFFFFF ;
 	margin-top: 5px;}
 .news1{width: 310px;height:280px;background:#ED1C24;margin:5px 10px; float: left;}
 .news2{width: 310px;height:280px;background:#ED1C24;margin: 5px 10px;float: left;}
 .news3{width: 310px;height:280px;background:#ED921C;margin: 5px 10px;float: right;}
 .news4{width: 310px;height:200px;background:#B5E61D;margin: 5px 10px;float: left;}
 .news5{width: 310px;height:200px;background:#C8BFE7;margin: 5px 10px;float: right;}
 .news6{width: 310px;height:280px;background:white;margin: 5px 10px;float: right;}
.now{width: 1000px;height:410px;background:#FFFFFF ;
 	margin-top: 5px;}
 .now1{width: 310px;height:400px;background:#3FCC77;margin:5px 10px; float: left;}
 .now2{width: 310px;height:400px;background:#3FCC77;margin: 5px 10px;float: left;}
 .now3{width: 310px;height:400px;background:#00A2E8;margin: 5px 10px;float: right;}
.bottom_image {width: 1000px;height: 100px;background: yellow;}
.list{width: 150px;height: 90px;background: #FFAEC9;
margin: 5px 5px;float: left;}
.bottom{width: 1000px;height: 180px;background: red;margin-top: 5px;}

	</style>	
</head>
<body>
<div class="body">
	<div class="header">
		<div class="logo"> <h2>logo</h2></div>
		<div class="search"><h2>搜索框</h2></div>
		<div class="link"><h2>导航</h2></div>	
	</div>
	<div class="baike">
		<div class="li">news</div>
		<div class="li">video</div>
		<div class="li">cars</div>
		<div class="li">tech</div>
		<div class="li">education</div>
		<div class="li">sport</div>
	</div>
	<div class="top3">
		<div class="QRcode">QRcode</div>
		<div class="hotpiont">hotpiont</div>
	</div>

	<div class="news">
		<div class="news1"></div>
		<div class="news2"></div>
		<div class="news3"></div>
	</div>

	<div class="news">
		<div class="news1"></div>
		<div class="news2"></div>
		<div class="news3"></div>
	</div>

	<div class="now">
		<div class="now1"></div>
		<div class="now2"></div>
		<div class="now3">图片</div>
	</div>
	<div class="top3">
		<div class="QRcode">QRcode</div>
	</div>
	<div class="news">
		<div class="news1"></div>
		<div class="news2"></div>
		<div class="news3">图片</div>
	</div>
	<div class="news">
		<div class="news1"></div>
		<div class="news2"></div>
		<div class="news3">图片</div>
	</div>
	<div class="news">
		<div class="news4"></div>
		<div class="news4"></div>
		<div class="news5">图片</div>
	</div>
	<div class="top4">广告图</div>
	<div class="news">
		<div class="news1"></div>
		<div class="news2"></div>
		<div class="news3">图片</div>
	</div>
	<div class="news">
		<div class="news1"></div>
		<div class="news2"></div>
		<div class="news3">图片</div>
	</div>
	<div class="QRcode">QRcode</div>

	<div class="news">
		<div class="news1"></div>
		<div class="news2"></div>
		<div class="news3">图片</div>
	</div>
	<div class="news">
		<div class="news1"></div>
		<div class="news2"></div>
		<div class="news6">空白</div>

	</div>
	<div class="news">
		<div class="news1"></div>
		<div class="news2"></div>
		<div class="news3">图片</div>
	</div>
	<div class="news">
		<div class="news4"></div>
		<div class="news4"></div>
		<div class="news5">图片</div>
	</div>
	<div class="bottom_image">

		<div class="list">轮播图片1</div>
		<div class="list">图片2</div>
		<div class="list">图片3</div>
		<div class="list">图片4</div>
		<div class="list">图片5</div>
		<div class="list">图片6</div>
	</div>
	<div class="top4">广告图</div>
	<div class="bottom">相关文字</div>

	

</div>
</body>
</html>